<template>
	<view>
		
		<uni-popup ref="confirmRef" type="dialog">
			<!-- <uni-popup-dialog mode="base" :before-close="true" okText="确定" @close="handleClose" @confirm="handleConfirm">
				<template #title>
					<view class="tip-content"></view>
				</template>
				<template #content>
					<view class="popup-content">{{ confirmText }}</view>
				</template>
			</uni-popup-dialog> -->
			<uni-popup-dialog :type="msgType" cancelText="取消" confirmText="确认" title="提示" :content="confirmText" @confirm="handleConfirm" @close="handleClose">
				<slot></slot>
			</uni-popup-dialog>
		</uni-popup>
		
	</view>
</template>

<script setup>
/* 
	用于二次确认弹窗
	参数1 确认按钮回调函数
	参数2 取消按钮回调函数
	参数3 弹框内部提示文字 
*/
import { ref } from 'vue'
import useBackPress from '@/hooks/useBackPress.js'
const confirmRef = ref()

let confirmText = ref('')
let confirmPop = () => {}
let cancelPop = () => {}

// 处理开启弹窗 与 关闭弹窗 的 阻断返回
const popupopened = () => {
	// #ifdef H5 || APP-PLUS
		active()
	// #endif
}

const popupclosed = () => {
	// #ifdef H5 || APP-PLUS
	inactive()
	// #endif
}

const closeEd = () => {
	confirmRef.value.close()
}

// #ifdef H5 || APP-PLUS
const { active, inactive } = useBackPress(closeEd)  // onBackPress 阻断返回
// #endif

// 确认按钮
const handleConfirm = () => {
	popupclosed()
	confirmPop()
	confirmRef.value.close()
}

// 取消按钮
const handleClose = () => {
	cancelPop()
	popupclosed()
	confirmRef.value.close()
}

// 开启弹窗，供父组件调用传递函数
const comfirmOpen = (confirm = () => {},  tipText = '您确认要改变状态吗?', cancel = () => {}) => {
	
	confirmPop = confirm
	cancelPop = cancel
	confirmText.value = tipText
	confirmRef.value.open()
	popupopened()
}

defineExpose({ comfirmOpen })

</script>

<style scoped lang="scss">

</style>